<template>
    <div>
    <div class="border-s my-test">
        <el-table :data="tableData" style="width: 100%" :border="false">
            <el-table-column prop="name" label="考试名称"></el-table-column>
            <el-table-column prop="address" label="考试地点"></el-table-column>
            <el-table-column prop="examTime" label="考试时间"></el-table-column>
            <el-table-column prop="applyStartTime" label="报名开始时间"></el-table-column>
            <el-table-column prop="applyEndTime" label="报名截止时间"></el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button @click="toDetail(scope.row)" type="text" size="medium" class="button-my-test">报名</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
    <el-pagination
            background
            layout="total, sizes, prev, pager, next, jumper"
            :page-size="parmes.size"
            @current-change="handleCurrentChange"
            :page-sizes="[10, 20, 30, 40]"
            @size-change="pageFy"
            :total="total">
            </el-pagination>
    </div>
</template>
<script>
import apiHttp from '../../api/index.js'
export default {
    data(){
        return{
            tableData:[],
            parmes:{
                current:1,
                size:10
            },
            total:0
        }
    },
    mounted(){
        this.list()
    },
    methods: {
        handleCurrentChange(val) {
            this.parmes.current = val
            this.list()
        },
        pageFy(val){
            this.parmes.size = val
            this.list()
        },
        // 列表
        list(){
            apiHttp.apiIndex.applyList(this.parmes).then(resp=>{
                if(resp.code == 0){
                    this.tableData = resp.data.records
                    this.total = Number(resp.data.total)
                }
            })
        },
        // 去报名
        toDetail(row){
            localStorage.setItem('miaoshu',row.description)
            this.$router.push({
                path:'/students/notice',
                query:{
                    ksId:row.id
                }
            })
        }
    }
}
</script>
<style lang="less">
.my-test{
    .el-table td, .el-table th{
        text-align: center;
        font-size: 16px;
        color: #000;
    }
    .el-table td, .el-table th.is-leaf{
        border-bottom: solid 1px #bfbfbf;
    }
    .el-table th{
        color: #fff;
        background-color: #5d2805;
    }
    .button-my-test span{
        border: solid 1px #5d2805;
        padding: 5px 10px;
        color: #000;
        border-radius: 3px;
        font-size: 14px;
    }
}
</style>
